<template>
  <div>
    <home-header :city="city"></home-header>
    <home-swiper :swiper="swiper"></home-swiper>
    <home-icons  :iconList="iconList"></home-icons>
    <home-other :hotbdan = "hotbdan" :yLike="yLike"></home-other>
    <home-week :weekList = "weekList"></home-week>
    <home-footer></home-footer>
  </div>
</template>
<script>
  import HomeHeader from '@/pages/Home/components/Header'
  import HomeSwiper from '@/pages/Home/components/Swiper-vue'
  import HomeIcons from '@/pages/Home/components/icons'
  import HomeOther from '@/pages/Home/components/Other'
  import HomeWeek from '@/pages/Home/components/Week'
  import HomeFooter from '@/pages/Home/components/Footer'
  import  axios from 'axios'
    export default {
        name: "home",
        components:{
          HomeHeader,
          HomeSwiper,
          HomeIcons,
          HomeOther,
          HomeWeek,
          HomeFooter
        },
        data(){
          return{
            city:"",
            swiper:[],
            iconList:[],
            hotbdan:[],
            yLike:[],
            weekList:[]
          }
        },
        methods:{//创建函数
            getHomeInfo(){//引入数据
              axios.get('/static/makce/index.json').then(this.getSucc)
            },
            getSucc(res){
                res = res.data
                if(res.ret && res.data){
                      const data = res.data;
                      this.city = data.city;
                      this.swiper = data.swiperList;
                      this.iconList = data.iconList;
                      this.hotbdan = data.hotJd;
                      this.yLike = data.yLike;
                      this.weekList = data.WeekList;
                }
                // console.log(res.data)
            }
        },
        mounted(){//钩子函数(一般用来向后端发起请求拿到数据后做一些业务处理)
            this.getHomeInfo();
        }
    }
</script>

<style scoped>

</style>
